<template>
  <div style="text-align: center;padding-top: 8vh;">
    <nut-image :src="logo" width="50" height="50" position="center" style="margin: 0 auto;" />
    <div style="font-size: 22px;margin-top: 30px;"  >三智云</div>
    <div style="padding: 40px;">
      <nut-form  ref="loginFormRef" :model-value="formData">
        <nut-form-item label="用户名" prop="username"    :rules="[{ required: true, message: '请输入用户名' }]">
          <nut-input v-model="formData.username" placeholder="请输入用户名" type="text" />
        </nut-form-item>
        <nut-form-item label="密码" prop="userpwd"    :rules="[{ required: true, message: '请输入密码' }]">
          <nut-input v-model="formData.userpwd" placeholder="请输入密码" type="password" />
        </nut-form-item>
      </nut-form>
    </div>
    <div style="padding: 40px;">
      <nut-button type="info" size="large" block @click="login">登 录</nut-button>
    </div>
  </div>
</template>
<script setup>
import logo from '/logo.png'
import {onMounted, ref} from "vue";
import tool from "@/utils/tool.js";
import {useRouter} from "vue-router";
const router = useRouter()
const formData = ref({
  username: '',
  userpwd: '',
})
onMounted(() => {
  let user = tool.data.getUser()
  if(user) {
    if(user.token) {
      router.replace({
        name: 'home'
      })
    }
  }
})
const loginFormRef = ref(null)
const login = () => {
  loginFormRef.value?.validate().then(({ valid, errors }) => {
    if (valid) {
      let obj = {
        username: formData.value.username,
        userpwd: tool.crypto.MD5(formData.value.userpwd)
      }
      tool.post('user/login', obj, true, false).then(ret => {
        if (ret.stat) {
          let info = ret.data
          tool.data.setUser(info)
          tool.data.set("v4TOKEN", info.token)
          tool.data.set("loginType", 'gs')
          setTimeout(() => {
            router.replace({
              name: 'home'
            })
          }, 500)
        }
      })

    }
    else {
      tool.err('请输入用户名密码')
    }
  })
}


</script>